<template>
	<view :id="templateId" v-if="loaded" class="container">
		<empty
			:src="baseTemplateFileUri + 'image/emptyStatus/common.png'"
			v-if="!goodsList.length"
		></empty>
		<template v-else>
			<uni-banner :image="baseTemplateFileUri + currentPageBanner">
			</uni-banner>
			<view class="goods-wrap">
				<!-- 活动列表 begin -->
				<uni-m-goods-col
					v-for="(item, index) in goodsList"
					:key="index"
					:goods="item"
					:showAdditional="false"
					:goodsPrice="item.priceStr.split('.')"
					:goodsImageTag="
						(item.activityType === 10 && item.activityName) || ''
					"
					:latePrice="item.priceOut"
					:routeLink="
						`/pages/common/pages/goods/goodsDetail?goodsId=${item.goodsId}`
					"
				>
					<view
						slot="goodsType"
						:style="themeStyles.textAdronmentColor"
						class="goods-countdown"
					>
						<text>距离结束</text>
						<uni-countdown
							:showDay="false"
							:color="themeStyles.adronmentColor"
							:splitorColor="themeStyles.adronmentColor"
							:hour="item.countDown.hh"
							:minute="item.countDown.mm"
							:second="item.countDown.ss"
						>
						</uni-countdown>
					</view>
					<button
						:style="{
							color: themeStyles.auxiliaryColor,
							background: `linear-gradient(160deg, ${themeStyles.mainColor}80, ${themeStyles.mainColor})`
						}"
						class="goods-btn"
						slot="metaRight"
					>
						{{ btnTxt }}
					</button>
				</uni-m-goods-col>
				<!-- 活动列表 end -->
			</view>
			<view
				v-if="linkBtnTxt"
				@click="routeMyActivity()"
				:style="themeStyles.btnFullColor"
				class="link-activity"
			>
				<uni-icon
					:color="themeStyles.auxiliaryColor"
					size="32rpx"
					:name="linkIcon"
				>
				</uni-icon>
				<text class="link-activity-text">{{ linkBtnTxt }}</text>
			</view>
		</template>
	</view>
</template>

<script>
/** api begin */
import { queryMyGroupList } from "@/lib/api/groupServer/group";

import { queryGoodsList } from "@/lib/api/goodsServer/goods";
/** api end */

/** components begin */
import empty from "@/components/empty";
import uniCountdown from "@/components/uniCountdown/uniCountdown";
import uniMGoodsCol from "@/components/goods/uniMGoodsCol";
import uniBanner from "@/components/uniBanner";
import uniIcon from "@/components/uniIcon/uniIcon";
/** components end */

/** mixins begin */
import bannerMixin from "@/mixins/banner";
import goodsMixin from "@/mixins/goods/goods";
/** mixins end */

let currentPage = 1;
export default {
	components: {
		uniCountdown,
		uniMGoodsCol,
		empty,
		uniBanner,
		uniIcon
	},

	mixins: [goodsMixin, bannerMixin],

	data() {
		return {
			currentPageBanner: "", // 当前页面banner图
			activityList: [], // 正在进行的活动
			isPop: false,
			activityType: 10, // 10: 拼团; 20: 砍价;
			btnTxt: "拼",
			pageTitle: "好友拼团",
			linkBtnTxt: "我的拼团",
			linkIcon: "group-full"
		};
	},

	async onLoad(option) {
		currentPage = 1;
		this.activityType = parseInt(option.activityType);
	},

	onShow() {
		this.viewActivityType();
		this.getActivityList();
	},

	//下拉刷新
	async onPullDownRefresh() {
		this.loaded = false;
		currentPage = 1;
		this.resetData();
		await this.getActivityList();
		uni.stopPullDownRefresh();
	},

	methods: {
		resetData() {
			this.activityList = [];
		},

		// 获取活动商品列表
		async getActivityList() {
			try {
				const propsData = {
					currentPage,
					activityType: this.activityType
				};
				await this.getGoodsListAll(propsData);
				this.loaded = true;
			} catch (error) {
				console.log("error", error);
				this.$api.showToast(error.resultInfo || "出错了 *_*");
			}
		},

		/**
		 * 跳转到我的活动页
		 */
		routeMyActivity() {
			switch (this.activityType) {
				case 10:
					this.loginNavTo("/pages/activity/pages/myGroup");
					break;
				case 20:
					this.loginNavTo("/pages/activity/pages/myBargain");
					break;
				default:
					break;
			}
		},

		// 根据状态值展示活动类型
		viewActivityType() {
			switch (this.activityType) {
				case 10:
					this.btnTxt = "拼";
					this.pageTitle = "好友拼团";
					this.linkBtnTxt = "我的拼团";
					this.linkIcon = "group-full";
					this.currentPageBanner = this.pageBanner.team;
					break;
				case 20:
					this.btnTxt = "砍";
					this.pageTitle = "助力砍价";
					this.linkBtnTxt = "我的砍价";
					this.linkIcon = "bargain-full";
					this.currentPageBanner = this.pageBanner.bargain;
					break;
				case 30:
					this.btnTxt = "抢";
					this.pageTitle = "限时促销";
					this.linkBtnTxt = "";
					this.currentPageBanner = this.pageBanner.sale;
					break;
				default:
					break;
			}

			// 设置页面标题
			uni.setNavigationBarTitle({
				title: this.pageTitle
			});
		},

		navToDetailPage(item) {
			const id = item.title;
			uni.navigateTo({
				url: `/pages/common/pages/goods/goodsDetail?goodsId=${id}`
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import "@/pages/activity/styles/activityList.scss";
</style>
